﻿<%@ Page Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeFile="question.edit.aspx.cs" Inherits="admin_question_edit" %>

<asp:Content ContentPlaceHolderID="titleContent" runat="Server">练习题编辑</asp:Content>
<asp:Content ContentPlaceHolderID="headContent" runat="Server">
    <link href="/content/font-awesome/css/font-awesome.css" rel="stylesheet" />
    <link href="/content/bootstrap/ext/summernote/summernote.css" rel="stylesheet" />
    <style type="text/css">
        .option-add-button {
            background-position: center center;
            border: 1px dashed #C0C0C0;
            height: 100%;
            background-color: #F2F2F2;
            cursor: pointer;
        }

        #title-toolbar {
            border: 1px dashed #808080;
            padding: 3px;
            background-color: #CCCCCC;
            display: none;
            position: absolute;
        }
    </style>
</asp:Content>
<asp:Content ContentPlaceHolderID="mainContent" runat="Server">
    <h4><%=ChapterGrade %> > <%=ChapterSubject %> > <%=ChapterPart %>  > <%=ChapterTitle %> > 练习</h4>
    <hr style="margin-top: 0px; margin-bottom: 5px;" />
    <form class="form-horizontal" runat="server" method="post">
        <input type="hidden" name="cid" value="<%=Data<decimal>("cid") %>" />
        <input type="hidden" name="qid" value="<%=Data<decimal>("qid") %>" />
        <input type="hidden" name="creator" value="<%=Data<decimal>("creator") %>" />
        <input type="hidden" name="systime" value="<%=Data<DateTime>("systime") %>" />
        <input type="hidden" name="status" value="<%=Data<decimal>("status") %>" />
        <div class="row">
            <div class="col-xs-6" style="padding-left: 28px;">
                <div class="form-group">
                    <label class="col-xs-2 control-label" for="content">题型</label>
                    <div class="controls  col-xs-10">
                        <select class="form-control" id="type" name="type" onchange="changeType(this);" <%=Data<decimal>("qid") > 0 ? "disabled" : string.Empty %>>
                            <option value="0_radio" <%=Data<int>("type") == 0 ? " selected" : string.Empty %>>单选</option>
                            <option value="1_checkbox" <%=Data<int>("type") == 1 ? " selected" : string.Empty %>>多选</option>
                            <option value="2_text" <%=Data<int>("type") == 2 ? " selected" : string.Empty %>>填空题</option>
                            <option value="3_textarea" <%=Data<int>("type") == 3 ? " selected" : string.Empty %>>简答题</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-xs-2 control-label" for="title">分值</label>
                    <div class="controls  col-xs-10">
                        <input type="number" class="form-control" id="score" name="score" value="<%=Data("score") %>" />
                    </div>
                </div>
            </div>
        </div>

        <div class="form-group<%=Data<int>("type") == 2 ? " hidden":string.Empty %>" id="otherTitle">
            <label for="title1" class="col-xs-1 control-label">题目</label>
            <div class="controls col-xs-11">
                <input type="text" class="form-control" id="title1" name="title1" value="<%=Data("title") %>" />
            </div>
        </div>
        <div class="form-group<%=Data<int>("type") != 2 ? " hidden":string.Empty %>" id="textareaTitle">
            <label for="title2" class="col-xs-1 control-label">内容</label>
            <div class="controls col-xs-11">
                <div id="title-toolbar">
                    <a class="btn btn-default" href="javascript:void(0)" onclick="insertBlank();">插入填空</a>
                </div>
                <textarea class="form-control" rows="10" cols="120" id="title2" name="title2" onfocus="setToolbarVisible(this,true);" onblur="buildOptions(this);"><%=Data("title") %> </textarea>
                <div style="color: green">提示： 用连续的下划线表示一空.</div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-xs-1 control-label" for="content">备注</label>
            <div class="controls col-xs-11">
                <textarea class="form-control" rows="10" cols="120" id="content" name="content"><%=Data("content") %> </textarea>
            </div>
        </div>
        <div class="form-group<%=Data<int>("type") == 3 ? " hidden":string.Empty %>" id="optionContainer">
            <label class="col-xs-1 control-label">选项</label>
            <div class="controls col-xs-11" id="option-container">
                <asp:Repeater runat="server" ID="listOptions">
                    <ItemTemplate>
                        <div style="height: 3px;"></div>
                        <div class="row">
                            <div class="col-xs-1 text-right">
                                <label class="control-label"><%# Container.ItemIndex + 1 %>.</label>
                            </div>
                            <div class="col-xs-7">
                                <input class="form-control" type="text" id="option_<%# Eval("oid") %>" name="option_<%# Eval("oid") %>" value="<%# Eval("answer") %>" />
                            </div>
                            <div class="col-xs-2">
                                <label class="checkbox inline">
                                    <input type="checkbox" id="chk_option_<%# Eval("oid") %>" name="chk_option_<%# Eval("oid") %>" <%# Eval("answer") == Eval("right") ? "checked":string.Empty %> onclick="rightChanged(this);" value="1" />正确答案
                                </label>
                            </div>
                            <div class="col-xs-2">
                                <input class="form-control" type="text" id="score_option_<%# Eval("oid") %>" name="score_option_<%# Eval("oid") %>" value="<%# Eval("score") %>" placeholder="分值" />
                            </div>
                        </div>
                    </ItemTemplate>
                    <FooterTemplate>
                        <div style="padding-top: 3px;" id="options-footer">
                            <div class="option-add-button text-center pull-left" onclick="addOption();" style="margin-right: 10px; width: 60px;">
                                <img src="/content/images/addx48.png" style="height: 36px;" alt="添加选项" />
                            </div>
                            <div class="option-add-button text-center pull-left" style="width: 60px;" onclick="insertOption();">
                                <img src="/content/images/Data-Add-32.png" style="height: 36px;" alt="在当前项前面插入新项" />
                            </div>
                            <div class="clearfix"></div>
                        </div>
                    </FooterTemplate>
                </asp:Repeater>
            </div>
        </div>
        <div class="form-group<%=Data<int>("type") != 3 ? " hidden":string.Empty %>" id="rightContainer">
            <label class="col-xs-1 control-label" for="right">答案</label>
            <div class="controls col-xs-11">
                <textarea class="form-control" rows="10" cols="120" id="right" name="right"><%=Data("rightanswer") %> </textarea>
            </div>
        </div>
        <div class="pull-right">
            <asp:LinkButton runat="server" CssClass="btn btn-success" OnClick="btnSave_Click"><i class="cus-icon-save"></i>保存</asp:LinkButton>&nbsp;
            <a class="btn btn-default" href="javascript:void(0);" onclick="history.go(-1);"><i class="cus-icon-back"></i>返回</a>
        </div>
        <script type="text/javascript">
            
        </script>
    </form>
</asp:Content>
<asp:Content ContentPlaceHolderID="scriptContent" runat="Server">
    <script src="/content/bootstrap/ext/summernote/summernote.js" type="text/javascript"></script>
    <script type="text/javascript">
        var addOption = function () {
            var len = $("input[name^='option_']").length;
            var footer = $("#options-footer");

            var html = "<div class=\"col-xs-1 text-right\">"
                               + "<label class=\"control-label\">" + (len + 1) + ".</label>"
                          + "</div>"
                          + "<div class=\"col-xs-7\">"
                               + "<input class=\"form-control\" type=\"text\" id=\"option_0_" + (len + 1) + "\" name=\"option_0_" + (len + 1) + "\"/>"
                          + "</div>"
                          + "<div class=\"col-xs-2\">"
                               + "<label class=\"checkbox inline\">"
                                    + "<input type=\"checkbox\" id=\"chk_option_0_" + (len + 1) + "\" name=\"chk_option_0_" + (len + 1) + "\" value=\"1\"/>正确答案"
                               + "</label>"
                          + "</div>"
                          + "<div class=\"col-xs-2\">"
                               + "<input type=\"number\" class=\"form-control\" type=\"text\" placeholder=\"分值\" id=\"score_option_0_" + (len + 1) + "\" name=\"score_option_0_" + (len + 1) + "\"/>"
                          + "</div>";

            $("<div>").css("height", "3px").insertBefore(footer);
            $("<div>").addClass("row").html(html).insertBefore(footer);
        };

        var insertOption = function () {

        }

        var buildOptions = function () {

        }


        var rightChanged = function (src) {
            var type = $("#type").val();
            if (type == "0_radio" && src.checked) $("input[name^='chk_option_']").each(function (idx, el) {
                if (this.id != src.id) this.checked = false;
            });
        }

        var setToolbarVisible = function (src, ishover) {
            var toolbar = $("#title-toolbar");
            if (ishover) {
                var location = $(src).position();
                toolbar.css("width", $(src).width() + 25).css("display", "block").css("left", location.left).css("top", location.top - toolbar.height() - 8);
                if (src.bindEvent !== true) {
                    $("input,textarea[name!='" + src.id + "'],select").on("focus", function () { $("#title-toolbar").hide(); });
                    src.bindEvent = true;
                }
            }
            else {
                toolbar.hide();
            }
        }

        var insertBlank = function () {
            var editor = $("textarea[name='title2']");
            var val = editor.val();
            editor.val(val + "______")
        }

        var changeType = function (src) {
            var url = new window.UrlParser();
            url.params["type"] = src.value.charAt(0);
            window.location.replace(url.getUrl());
            return;

            var _setVisible = function (el, v) {
                if (v) {
                    if (el[0].className.indexOf("hidden") >= 0) el.removeClass("hidden");
                }
                else {
                    if (el[0].className.indexOf("hidden") < 0) el.addClass("hidden");
                }
            }


            if (src.value == "2_text") {
                _setVisible($("#textareaTitle"), true);
                _setVisible($("#otherTitle"), false);
            }
            else {
                _setVisible($("#textareaTitle"), false);
                _setVisible($("#otherTitle"), true);
            }

            if (src.value == "3_textarea") {
                _setVisible($("#rightContainer"), true);
                _setVisible($("#optionContainer"), false);
            }
            else {
                _setVisible($("#rightContainer"), false);
                _setVisible($("#optionContainer"), true);
            }

        }
    </script>
</asp:Content>



